<template>
  <div class="wechatList" style="background-color: #ececec; padding: 20px;">
    <ta-list :grid="{ gutter: 16, column: 3 }"
             :dataSource="data">
        <ta-list-item slot="renderItem" slot-scope="item, index">
          <ta-card :title="item.title" :bordered=false>
            <a href="#" slot="extra">
              <ta-row :gutter="16">
                <ta-col :span="8">
                  <ta-switch defaultChecked size="small"/>
                </ta-col>
                <ta-col :span="8">
                  <ta-icon type="edit"/>
                </ta-col>
                <ta-col :span="8">
                  <ta-icon type="delete"/>
                </ta-col>
              </ta-row>
            </a>
            <div style="width: 30%;height: 100%;float: left"><img src="img/wechatLogo.png"/></div>
            <div style="width: 70%;float: right">
              <p>{{item.content}}</p>
              <p>{{item.desc}}</p>
            </div>
          </ta-card>
        </ta-list-item>
    </ta-list>

    <ta-card>
      <ta-icon/>
      <template class="ant-card-actions" slot="actions">
        <p @click="fnShowDraw">添加公众号</p>
      </template>
    </ta-card>

    <wechat-add-edit :visible="editVisible" @close="editVisible = false"  :editType="editType" :rowData="rowData">
    </wechat-add-edit>
  </div>
</template>

<script>
import wechatAddEdit from './part/wechatAddEdit'
const data = [
  {
    title: 'Title 1',
    content:'content1',
    desc:'desc1',
  },
  {
    title: 'Title 2',
    content:'content2',
    desc:'desc2',
  },
  {
    title: 'Title 3',
    content:'content3',
    desc:'desc3',
  },
  {
    title: 'Title 4',
    content:'content4',
    desc:'desc4',
  },
]

export default {
  name: 'wechatManage',
  components: {wechatAddEdit},
  data () {
    return {
      data,
      editVisible:false,
      rowData:[],
      editType:'',
    }
  },
  mounted(){
    this.fnQuery()
  },
  methods:{
    fnQuery(){

    },
    fnShowDraw(){
      this.editVisible = true;
      this.editType = '1';
      this.rowData = {};
    },
  }
}


</script>

<style scoped type="text/scss">
  .button-div{
    width: 100%;
    text-align: center;

  }
</style>
